<template>
  <el-descriptions ref="ruleFormRef" :column="2" direction="vertical" v-loading="isLoading">
    <el-descriptions-item width="50%" :label="titles.unityName">
      {{ isNullOrEmpty( operate.unityName ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.projectName">
      {{ isNullOrEmpty( formInline?.workerOrderInfo?.projectName ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.workOrderTitle">
      {{ isNullOrEmpty( formInline?.workerOrderInfo?.workOrderTitle ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.projectName">
      {{ isNullOrEmpty( formInline?.workerOrderInfo?.projectName ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.workOrderType">
      {{ isNullOrEmpty( WORKORDER_TYPETEXT[formInline?.workerOrderInfo?.workOrderType]?.label ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.workOrderStatus">
      {{ isNullOrEmpty( WORKORDER_STATUSTEXT[formInline?.workerOrderInfo?.workOrderStatus]?.label ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.waiting">
      <!-- {{ isNullOrEmpty( formInline?.workerOrderInfo?.waiting ) }} -->
      {{ isNullOrEmpty( formInline?.workerOrderInfo?.node[formInline?.workerOrderInfo?.activeNodeIndex]?.stepName ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.createdByName">
      {{ isNullOrEmpty( formInline?.workerOrderInfo?.createdByName ) }}
    </el-descriptions-item>
    <el-descriptions-item width="50%" :label="titles.createdAt">
      {{ isNullOrEmpty( formInline?.workerOrderInfo?.createdAt ) }}
    </el-descriptions-item>
  </el-descriptions>
</template>

<script setup lang="ts">
import {isNullOrEmpty} from '@/utils/functions'
import {
  usePageVariablesStoreHook,
} from "@/store/modules/pageVariables";
const operate = usePageVariablesStoreHook().getOperate();
import { ref } from "vue";
import { titles } from "./index";
import type { infoType } from "@/api/operate/work-management/work-management/index";
type FormProps = {
  formInline: infoType;
  isLoading: boolean;
};
import {
  WORKORDER_TYPETEXT,
  WORKORDER_STATUSTEXT
} from "@/constant/workorder-mangenment";
const props = withDefaults(defineProps<FormProps>(), {
  formInline: () => ({}) as infoType,
  isLoading: false
});
const ruleFormRef = ref();
const closeDialogFn = ref(null)

onMounted(() => {
  console.log(props.formInline, "工单详情");
});
const closeDialog = (fn?) => {
  fn ? closeDialogFn.value = fn : closeDialogFn.value()
}
function getRef() {
  return ruleFormRef.value;
}
defineExpose({ getRef, closeDialog });
</script>
